<template>
    <div class="user-legal-box">
        <div class="user-legal-title">我的权益</div>
        <div class="user-legal-list">
            <div class="user-legal-item">
                <div class="legal-detail">{{userAccountInfo.free_times}}次/月</div>
                <div class="legal-title">店主权益</div>
            </div>
            <div class="line"></div>
            <div class="user-legal-item">
                <div class="legal-detail">{{userAccountInfo.vip_expire}}</div>
                <div class="legal-title">到期时间</div>
            </div>
            <div class="line"></div>
            <div
                class="user-legal-item"
                @click="goTeam"
            >
                <div class="legal-detail">{{parseInt(teamVipData.level_0)+parseInt(teamVipData.level_1)+parseInt(teamVipData.level_2)+parseInt(teamVipData.level_3)+parseInt(teamVipData.level_4)}}</div>
                <div class="legal-title">数据管理</div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: 'UserLegal',
    props: ['teamVipData', 'userAccountInfo'],
    methods: {
        goTeam() {
            this.$router.push('/team')
        }
    }
}
</script>

<style lang="stylus" scoped>
.user-legal-box
    margin-top .18rem
    padding 0.4rem 0
    background #fff
    .user-legal-title
        padding 0 0.34rem
        font-weight bold
        font-size 0.37rem
        color #131313
        line-height 1
    .user-legal-list
        display flex
        align-items center
        margin-top 0.58rem
        .user-legal-item
            flex 1
            text-align center
            .legal-detail
                font-size 0.37rem
                color #131313
            .legal-title
                margin-top 0.26rem
                font-size 0.34rem
                color #888
        .line
            height 0.48rem
            width 1px
            background #999
</style>
